<template>
	<view class="homework">
		<u-navbar :border-bottom="false" title="布置作业"></u-navbar>
		<view class="container">
			<view class="block">
				<u-form :model="form" label-position="top" :label-style="{color:'#1F2329',fontSize: '28rpx',lineHeight: '40rpx'}">
					<u-form-item class="form-item" label="作业标题" prop="title">
						<u-input v-model="form.title" />
					</u-form-item>
					<u-form-item class="form-item" label="发送学员" prop="type">
						<u-input class="studentList" v-model="studentValue.title" type="select" @click="showPop = true" placeholder="请选择需要发送的学员" />
					</u-form-item>
					<u-form-item class="form-item" label="截止时间" prop="deadline">
						<u-input v-model="form.deadline" type="select" @click="showEndtime = true" placeholder="请选择提交作业的截止时间" />
					</u-form-item>
					<view class="tip">截止时间前第六个小时，还未提交作业的系统会信息提醒一次</view>
					<u-form-item class="form-item" label="作业要求" prop="request" v-show="!showPop">
						<u-input v-model="form.request" type="textarea" :maxlength="99999" />
					</u-form-item>
					<u-form-item ref="formItem" class="form-item" label="上传图片或视频" prop="file">
						<my-upload :action="action" name="zyfile" @success="uploadSuccess" @remove="uploadRemove"></my-upload>
					</u-form-item>
				</u-form>
			</view> 
		</view>
		<u-popup mode="center" v-model="showPop" width="100%" height="100%" >
			<studentSelect :value.sync="studentValue" :show.sync="showPop"></studentSelect>
		</u-popup>
		<u-picker v-model="showType" mode="selector" :range="rangeType" @confirm="idx=>{type = rangeType[idx].value,typeTitle = rangeType[idx].title;}" range-key="title"></u-picker>
		<u-picker v-model="showEndtime" @confirm="timePickerConfirm" :start-year="common.getDate().year" :end-year="parseInt(common.getDate().year) + 1" :params="timePickerParams"></u-picker>
		<view :style="'height: calc(120rpx + '+iosSafeBottom+'px + '+SafeBottom+'rpx);'"></view>
		<view class="footer" ref="footer" :style="'padding-bottom: calc('+iosSafeBottom+'px + '+SafeBottom+'rpx);box-sizing: content-box;'">
			<view class="btn" @click="submit">布置作业</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	import common from '../../../api/common.js'
	import request from '../../../api/request.js'
	const action = app.globalData.uploadUrl.zuoye
	export default{
		data(){
			return{
				common,
				action,
				iosSafeBottom:app.globalData.iosSafeBottom,
				SafeBottom:app.globalData.iosSafeBottom==0?'24':'-24',
				formData:{
					token:'MDAwMDAwMDAwMIPKbnI'
				},
				type:'',
				typeTitle:'',
				uploadFile:[],
				form:{
					title:"",
					students:'',
					deadline:'',
					request:'',
					file:"", //图片
				},
				studentValue:{
					data:[],
					studentId:[]
				},
				showPop:false,
				showType:false,
				rangeType:[{title:'班级',value:'class'},{title:'学员',value:'student'}],
				showEndtime:false,
				timePickerParams:{
					year: true,
					month: true,
					day: true,
					hour: true,
					minute: true,
					second: true
				},
			}
		},
		mounted() {
			
		},
		methods:{
			submit(){
				// let students = this.studentValue.studentId?this.studentValue.studentId.toString():''
				let students = JSON.stringify(this.studentValue.data)
				let file = this.uploadFile.toString()
				this.form.students = students
				this.form.file = file
				if(this.checkData(this.form)){
					request.go((e)=>{
						uni.showToast({
							title:"布置成功",
							icon:"success",
							duration:600
						})
						setTimeout(()=>{
							uni.navigateBack({})
						},600)
					},'/Jwteachertask/add',this.form,'POST')
				}
			},
			uploadSuccess(data){
				this.uploadFile.push(data.id) 
				this.uploadFile = [...new Set(this.uploadFile)]
				console.log("uploadSuccess",this.uploadFile,data)
			},
			uploadRemove(idx){
				this.uploadFile.splice(idx,1)
				// console.log("uploadRemove",this.uploadFile)
			},
			checkData(form){
				console.log(this.studentValue)
				if(form.title == ''){
					this.showErrToast('请填写作业标题')
					return false;
				}else if(this.studentValue.data.length == 0){
					this.showErrToast('请选择学员')
					return false;
				}else if(form.deadline == ''){
					this.showErrToast('请选择作业截止时间')
					return false;
				}else if(form.request == ''){
					this.showErrToast('请填写作业要求')
					return false;
				}else{
					return true
				}
			},
			showErrToast(title){
				uni.showToast({
					title,
					icon:"none"
				})
			},
			timePickerConfirm(e){
				let time = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second
				this.form.deadline = time
			},
		}
	}
</script>

<style scoped>
	.homework{
		min-height: 100vh;
		background-color: #f7f8fa;
	}
	.homework .container{
		width: 696rpx;
		margin: 32rpx auto 0;
		overflow: hidden;
		padding-bottom: 144rpx;
	}
	.homework .container .block{
		padding: 0 32rpx;
		background-color: #FFFFFF;
		box-sizing: border-box;
		border-radius: 24rpx;
	}
	.homework .container .tip{
		margin: 20rpx auto;
		font-size: 24rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #8f959e;
		line-height: 32rpx;
	}
	.homework .container .form-item .studentList >>> input{
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.homework .container .form-item >>> .u-upload{
		/* margin-left: -20rpx; */
	}
	.homework .container >>> .u-form-item{
		/* padding: 0; */
		/* margin-bottom: 20rpx; */
	}
	.homework .container >>> .form-item:nth-child(1) .u-input__input{
		/* font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Medium;
		font-weight: 700;
		color: #1f2329;
		line-height: 44rpx; */
		/* padding: 24rpx 0; */
	}
	.homework .container >>> .u-input__input{
		/* height: 44rpx;
		box-sizing: content-box; */
	}
	.homework .footer{
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 120rpx;
		background-color: #FFFFFF;
		z-index: 999;
	}
	.homework .footer .btn{
		width: 622rpx;
		height: 88rpx;
		line-height: 88rpx;
		text-align: center;
		margin: 24rpx auto 0;
		font-size: 32rpx;
		font-family: PingFang SC, PingFang SC-Regular;
		font-weight: 400;
		color: #ffffff;
		z-index: 99;
		background-color: #1661FF;
	}
</style>
